<template>
    <div class="pick-highlight">
        <el-label>开启悬浮拾取：</el-label>
        <el-switch v-model="allowPick" />
    </div>
</template>
<script setup lang="ts">
import { onMounted, ref } from "vue";
import { getMyProjectManager } from "@/getMyProjectManager";
const myProjectManager = getMyProjectManager();
const allowPick = ref(false)
myProjectManager.viewerCreatedEvent.don((viewer) => {
    // 鼠标悬停时间
    viewer.hoverTime = 0.3
    // 鼠标悬停事件监听
    viewer.hoverEvent.don((e) => {
        // 是否允许拾取
        if (!allowPick.value) return
        // pick事件发送
        viewer.pick(e.screenPosition, 'customPick', true).then(res => {
            // @ts-ignore
            if (res && res.childPickedInfo && res.childPickedInfo.uePickResult && res.childPickedInfo.uePickResult.parentInfo) {
                // @ts-ignore
                const parentInfo = res.childPickedInfo.uePickResult.parentInfo
                if (Array.isArray(parentInfo) && parentInfo.length > 0) {
                    const tags = parentInfo[0].actorTags
                    // 判断是否拾取到楼层相关内容通过floor
                    if (Array.isArray(tags) && tags.length > 0 && tags[0].includes("floor")) {
                        // 高亮楼层
                        myProjectManager.buildingCollection.setFloorHighLight(tags[0])
                    }
                }
            }
        })
    })
})
</script>
<style scoped>
.pick-highlight {
    color: #fff
}
</style>